<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:replace="header/h5header::h5header('登录','/assets/layui/css/layui.css,/assets/module/admin.css','')">
</head>

<body>

<!-- 正文 -->
<div class="Headline">

    <!-- 手机登录 -->
    <div class="passLogin" id="phoneLogin">
    	<div class="passLogin-cont layui-form" id="codelogin">
            <div class="passLogin-logo">
                <img src="/assets/H5/images/logo02.png" alt=""/>
            </div>
            <!-- 验证码登录 -->
           <div th:replace="login/h5common :: codelogin"></div>
       	</div>  
    	<div class="passLogin-cont layui-form" style="display:none;" id="accountlogin">
            <div class="passLogin-logo">
                <img src="/assets/H5/images/logo02.png" alt=""/>
            </div>
            <!-- 密码登录 -->
            <div th:replace="login/h5common :: accountlogin"></div>
       </div> 
       <div class="passLogin-cont layui-form" id="signup" style="display:none;">
            <div class="passLogin-logo">
                <img src="/assets/H5/images/logo02.png" alt=""/>
            </div>
           <!-- 注册 -->
            <div th:replace="login/h5common :: signup"></div>
       </div>    
        <!-- 底部点击去注册 -->
        <div th:replace="login/h5common :: butsignup"></div>
        
        <!-- 底部点击去登录 -->
        <div th:replace="login/h5common :: butlogin"></div>
    </div>
</div>

<script type="text/javascript">
layui.use(['layer', 'form', 'formX', 'setter', 'mynotice', 'cookie', 'admin', 'ax', 'util', 'notice'], function () {
	var $ = layui.jquery;
	var layer = layui.layer;
	var form = layui.form;
	var formX = layui.formX;
	var setter = layui.setter;
	var mynotice = layui.mynotice;
	var cookie = layui.cookie;
	var admin = layui.admin;
	var $ax = layui.ax;
	var util = layui.util;
	
	var pattern = /^1(3|4|5|7|8)\d{9}$/;
	var uuid = '';
	var reguuid = '';
	
	// 账号密码登录
  	form.on('submit(accountLoginBtn)', function(data){
  		admin.btnLoading('#accountLoginBtn', '登录中...'); 
    	var ajax = new $ax("/userLogin", 'post', function (res) {
    		setter.putToken(res.data.token);
    		$('#accountLoginBtn').attr('disabled', false)
        	admin.btnLoading('#accountLoginBtn', false);
    		return location.replace('/');
        }, function (res) {
        	$('#accountLoginBtn').attr('disabled', false)
        	admin.btnLoading('#accountLoginBtn', false);
        	layer.msg(res.msg);
        });
    	ajax.setData(JSON.stringify(data.field));
        ajax.start();
    	return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
    	return false;
  	});
	
	// 手机验证码登录
  	form.on('submit(phoneLoginBtn)', function(data){
  		admin.btnLoading('#phoneLoginBtn', '登录中...'); 
    	var ajax = new $ax("/userCodeLogin", 'post', function (res) {
    		$('#phoneLoginBtn').attr('disabled', false)
        	admin.btnLoading('#phoneLoginBtn', false);
    		return location.replace('/');
        }, function (res) {
        	$('#phoneLoginBtn').attr('disabled', false)
        	admin.btnLoading('#phoneLoginBtn', false);
        	layer.msg(res.msg);
        });
    	data.field.uuid = uuid;
    	ajax.setData(JSON.stringify(data.field));
        ajax.start();
    	return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
  	});
	
  	// 注册
    form.on('submit(userPhoneRegSubmit)', function(data){
    	if(data.field.agree != 1){
        	layer.msg('请同意隐私政策');
        	return false;
    	}
    	admin.btnLoading('#userPhoneRegSubmit', '正在注册...'); 
    	var ajax = new $ax("/signup", 'post', function (res) {
    		admin.btnLoading('#userPhoneRegSubmit', false);
        	$('#userPhoneRegSubmit').attr('disabled', false)
    		$("#accountlogin").show();
    		$("#butsignup").show();
        	$('#codelogin').hide();
        	$('#signup').hide();
        	$('#butlogin').hide();
            $("[name='username']").val(data.field.username);
            $("[name='password']").val('');
        }, function (res) {
        	admin.btnLoading('#userPhoneRegSubmit', false);
        	$('#userPhoneRegSubmit').attr('disabled', false)
        	layer.msg(res.msg);
        });
    	data.field.uuid = reguuid;
    	ajax.setData(JSON.stringify(data.field));
        ajax.start();
    	return false; //阻止表单跳转。如果需要表单跳转，去掉这段即可。
    });
	
	util.event('lay-event', {
		phoneCode: () => { // 手机验证码登录
			$("#codelogin").show();
			$("#butsignup").show();
    		$('#accountlogin').hide(); // 账号登录
        	$('#signup').hide(); // 注册
            $("#butlogin").hide(); // 去登录
    	},
    	passSig: () => { // 密码登录
    		$("#accountlogin").show();
    		$("#butsignup").show();
        	$('#codelogin').hide();
        	$('#signup').hide();
        	$('#butlogin').hide();
        },
        register: () => { // 去注册
        	$("#signup").show();
        	$("#butlogin").show();
        	$('#accountlogin').hide();
        	$('#codelogin').hide();
        	$('#butsignup').hide();
        },
        regSigIn: () => { // 去登录
        	$("#accountlogin").show();
    		$("#butsignup").show();
        	$('#codelogin').hide();
        	$('#signup').hide();
        	$('#butlogin').hide();
        },
        getCode: () => { // 获取验证码
        	var phone = $('#telphone').val();
        	if(phone == ''){
        		layer.msg('请输入手机号');
            	return false;
        	}
        	if(!pattern.test(phone)){
        		layer.msg('手机号码格式不正确');
            	return false;
        	}
        	admin.btnLoading('#signInCode'); 
        	var ajax = new $ax("/code/sms", 'get', function (res) {
        		uuid = res.data;
        		admin.btnLoading('#signInCode', false);
        		formX.startTimer('#signInCode', 30, function(time){
        			if(time == 1){
        				$('#signInCode').attr('disabled', false)
        			}
        			return time + 's';
                });
            }, function (res) {
            	admin.btnLoading('#signInCode', false);
            	$('#signInCode').attr('disabled', false)
            	layer.msg(res.msg);
            });
        	ajax.set('phone', phone);
            ajax.start();
        },
        regSnedCode: () => { // 注册发送短信验证码
        	var phone = $('#mobile').val();
        	if(phone == ''){
        		layer.msg('请输入手机号');
            	return false;
        	}
        	if(!pattern.test(phone)){
        		layer.msg('手机号码格式不正确');
            	return false;
        	}
        	admin.btnLoading('#registerBtn'); 
        	var ajax = new $ax("/register/sms", 'get', function (res) {
        		reguuid = res.data;
        		admin.btnLoading('#registerBtn', false);
        		formX.startTimer('#registerBtn', 30, function(time){
        			if(time == 1){
        				$('#registerBtn').attr('disabled', false)
        			}
        			return time + 's';
                });
            }, function (res) {
            	admin.btnLoading('#registerBtn', false);
            	$('#registerBtn').attr('disabled', false)
            	layer.msg(res.msg);
            });
        	ajax.set('phone', phone);
            ajax.start();
        },
	})
});
</script>

</body>
</html>